<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>字典管理</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8"/>
    <link rel="stylesheet" href="${re.contextPath}/plugin/layui/css/layui.css">
    <script type="text/javascript" src="${re.contextPath}/plugin/jquery/jquery-3.2.1.min.js"></script>
    <script type="text/javascript" src="${re.contextPath}/plugin/layui/layui.all.js" charset="utf-8"></script>
    <script type="text/javascript" src="${re.contextPath}/plugin/tools/tool.js"></script>
</head>

<body>

<form class="layui-form">
    <div class="layui-form-item">
        <fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
            <legend style="font-size:16px;">字典信息</legend>
        </fieldset>
    </div>

    <div class="layui-form-item">
        <input type="hidden" id="id" name="id" value="${dict.id}"/>
        <div class="layui-inline">
            <label for="dictName" class="layui-form-label">
                字典中文描述
            </label>
            <div class="layui-input-inline">
                <input type="text" id="dictName" name="dictName" lay-verify="dictName"
                       autocomplete="off" class="layui-input" value="${dict.dictName}">
            </div>
        </div>
        <div class="layui-inline">
            <label for="dictType" class="layui-form-label">
                字典类型
            </label>
            <div class="layui-input-inline">
                <input type="text" id="dictType" name="dictType"
                       autocomplete="off" class="layui-input" value="${dict.dictType}">
            </div>
        </div>
    </div>
    <div class="layui-form-item">
        <div class="layui-inline">
            <label for="dictValue" class="layui-form-label">
                字典值
            </label>
            <div class="layui-input-inline">
                <input type="text" id="dictValue" name="dictValue" lay-verify="dictValue" autocomplete="off"
                    class="layui-input" value="${dict.dictValue}">
            </div>
            <div id="ms" class="layui-form-mid layui-word-aux">

            </div>
        </div>
        <div class="layui-inline">
            <label for="dictDesc" class="layui-form-label">
                字典综述
            </label>
            <div class="layui-input-inline">
                <input type="text" id="dictDesc" name="dictDesc" lay-verify="dictDesc"
                       autocomplete="off" class="layui-input" value="${dict.dictDesc}">
            </div>

        </div>


    </div>
    <div class="layui-form-item">
        <div class="layui-inline">
            <label for="sort" class="layui-form-label">
                排序
            </label>
            <div class="layui-input-inline">
                <input type="text" id="sort" name="sort"
                       autocomplete="off" class="layui-input" value="${dict.sort}">
            </div>

        </div>

        <div class="layui-inline">
            <label for="pId" class="layui-form-label">
                父级字典
            </label>
            <div class="layui-input-inline">
                <select name="pId" id="pId" lay-search>
                </select>
            </div>
        </div>


    </div>
<div class="layui-form-item layui-form-text">
    <label class="layui-form-label">备注</label>
    <div class="layui-input-block" style="width:73%">
        <textarea placeholder="请输入备注" class="layui-textarea" name="remarks">${dict.remarks}</textarea>
    </div>
</div>
    <div style="width: 100%;height: 55px;background-color: white;border-top:1px solid #e6e6e6;
  position: fixed;bottom: 1px;margin-left:-20px;">
        <div class="layui-form-item" style=" float: right;margin-right: 30px;margin-top: 8px">
            <#if (detail!="readonly")>
            <button class="layui-btn layui-btn-normal" lay-filter="add" lay-submit="">
                确定
            </button>
        </#if>
        <button class="layui-btn layui-btn-primary" id="close">
            关闭
        </button>
    </div>
</form>

<script>
  var flag,msg;
  layui.use(['laytpl','form'],function(){
    var laytpl = layui.laytpl;
    var form = layui.form;
    loadAllDict(laytpl);
    function loadAllDict(laytpl){
        $.ajax({
           url:'loadAllDict',
           type:'get',
           success:function(res){
                if(res.flag){
                   $("#pId").empty();
                   var html="<option></option>";
                   var parentId = "${dict.parent.id}";
                   $(res.jsonObj.data).each(function(v,k){
                    if(parentId==k.id){
                        html+="<option value='"+k.id+"' selected='selected'>"+k.dictName+"</option>";
                    }else{
                          html+="<option value='"+k.id+"'>"+k.dictName+"</option>";
                    }
                   });
                   $("#pId").append(html);
                    form.render('select');

                }

           },
           beforeSend:function(){
<!--              layer.msg('加载中');-->
           }
        })
  }

  });

  $(function(){
      $('#dictValue').on("blur",function(){
        var dictType=$('#dictType').val();
        var dictValue=$('#dictValue').val();
        if(dictType!='') {
          $.ajax({
            url: 'checkValue?dictValue=' + dictValue+'&dictType='+dictType,
             async: false,
              type: 'get',
              success: function (data) {
              flag = data.flag;
              $('#ms').find('span').remove();
              if (!data.flag) {
                msg = data.msg;
                $('#ms').append("<span style='color: red;font-size:10px;'>"+data.msg+"</span>");
              }else{
                flag=true;
              }
            },beforeSend:function(){
              $('#ms').find('span').remove();
              $('#ms').append("<span>验证ing</span>");
            }
          });
        }
      });

  });
  layui.use(['form','layer'], function(){
    $ = layui.jquery;
    var form = layui.form
        ,layer = layui.layer;


    //自定义验证规则
    form.verify({
      dictValue: function(value){
        if(value.trim()==""){
          return "字典值不能为空";
        }
        if(value.match(/[\u4e00-\u9fa5]/)){
          return "字典值不能为中文";
        }
        if(!flag){
            return msg;
        }
      }
    })

   $('#close').click(function(){
     var index = parent.layer.getFrameIndex(window.name);
     parent.layer.close(index);
     return false;
   });
    //监听提交
    form.on('submit(add)', function(data){

      layerAjax('addDict', data.field, 'dictList');
      return false;
    });
    form.render();
  });





</script>
</body>

</html>
